<html>
<head>
<title>RChart , the Applet</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF" leftmargin="35">
<h3>RCHART, User Guide</h3>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><i>Copyright 2005, J4L 
  Components (http://www.java4less.com)</i></font> <br>
  <a href="tutorialcontents.html">Go bak to contents</a> </p>
<hr>
<h3><font face="Arial, Helvetica, sans-serif">The Applet</font></h3>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#0">My first 
    applet</a></font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#1">Deploying 
    the applet</a></font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#2">Realtime 
    applets</a></font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#3">Javascript 
    integration</a><br>
    </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Examples with </font> 
    <ul>
      <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#4">ASP</a></font></li>
      <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#5">JSP</a></font></li>
      <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#6">Php</a><br>
        </font></li>
    </ul>
  </li>
</ul>
<h4>&nbsp;</h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Applets are small java 
  programs that run inside your browser, this means they must be first downloaded 
  from the server so that they can be executed by your browser.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">In order to run applets 
  your browser must be Java enabled. RChart will run in old browsers also since 
  it also runs with Java version 1.1 or later.</font></p>
<p></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Applets are downloaded 
  and executed when the brower finds the &lt;APPLET&gt; tag inside the HTML code. 
  The tag has the following structure:</font></p>
<blockquote> 
  <blockquote>
    <p><b><font color="#669966">&lt;APPLET<br>
      CODE=...<br>
      CODEBASE=..<br>
      NAME=...<br>
      WIDTH=...<br>
      HEIGHT<br>
      &gt; </font></b><br>
      <i><font color="#0000FF">&lt;PARAM NAME = &quot;appletParameter1&quot; VALUE 
      = &quot;value1&quot;&gt; <br>
      &lt;PARAM NAME = &quot;appletParameter2&quot; VALUE = &quot;value2&quot;&gt; 
      <br>
      &lt;PARAM NAME = &quot;appletParameter3&quot; VALUE = &quot;value3&quot;&gt; 
      </font></i><br>
      ..... <br>
      <b><font color="#669966">&lt; /APPLET&gt;</font></b></p>
  </blockquote>
</blockquote>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The green code is used 
  to configurate the applet (size, name, Java class to be executed), and the blue 
  code is used to pass parameters to the applet. These are the parameters you 
  use to define a chart. As you see the chart definition is part of the &lt;Applet&gt; 
  tag contained in the HTML page, however it is also possible to read the chart 
  definition from a separate file.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">You can of course dinamically 
  create this HTML code using a server side script (ASP, Php, Jsp), you can see 
  some examples in this chapter.</font></p>
<h4>&nbsp;</h4>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="0"></a>My first 
  applet</font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">RChartApplet can be executed 
  with as litte code as:</font></p>
<blockquote> 
  <blockquote> 
    <p><font size="-1">&lt;HTML&gt;<br>
      &lt;BODY&gt;<br>
      &lt;APPLET<br>
      CODEBASE = &quot;./&quot;<br>
      CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
      NAME = &quot;TestApplet&quot;<br>
      ARCHIVE = &quot;rchart2.jar&quot;<br>
      WIDTH = 500<br>
      HEIGHT = 500 <br>
      ALIGN = middle<br>
      &gt;<br>
      &lt;PARAM NAME = &quot;TITLECHART&quot; VALUE = &quot;Sales 1999&quot;&gt;<br>
      &lt;PARAM NAME = &quot;XLABEL&quot; VALUE = &quot;Month&quot;&gt;<br>
      &lt;PARAM NAME = &quot;YLABEL&quot; VALUE = &quot;Million $&quot;&gt;<br>
      &lt;PARAM NAME = &quot;SERIE_1&quot; VALUE = &quot;Products&quot;&gt;<br>
      &lt;PARAM NAME = &quot;SERIE_DATA_1&quot; VALUE = &quot;12|43|50|45|30|32|42&quot;&gt;<br>
      &lt;/APPLET&gt;<br>
      &lt;/BODY&gt;<br>
      &lt;/HTML&gt;</font></p>
  </blockquote>
</blockquote>
<p><font face="Arial, Helvetica, sans-serif" size="-1">In order to run this applet 
  you must:</font></p>
<ol>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">copy this code to a 
    file: Applet.html</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">copy rchart2.jar to 
    the same directory</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Open Applet.html with 
    your browser</font></li>
</ol>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Of course this is a very 
  simple chart, you should now add new parameters to get a nicer chart.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">It is also possible to 
  have the chart parameters in a separate file, this is done like this:</font></p>
<ol>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Copy the following code 
    to applet.html<br>
    </font><br>
    <font size="-1">&lt;HTML&gt;<br>
    &lt;BODY&gt;<br>
    &lt;APPLET<br>
    CODEBASE = &quot;./&quot;<br>
    CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
    NAME = &quot;TestApplet&quot;<br>
    ARCHIVE = &quot;rchart2.jar&quot;<br>
    WIDTH = 500<br>
    HEIGHT = 500<br>
    HSPACE = 0<br>
    VSPACE = 0<br>
    ALIGN = middle<br>
    &gt;<br>
    &lt;PARAM NAME = &quot;DATAFILE&quot; VALUE = &quot;data.html&quot;&gt; </font>
    <p><font size="-1">&lt;/APPLET&gt;<br>
      &lt;/BODY&gt;<br>
      &lt;/HTML&gt;</font></p>
    <br>
  </li>
  <li><font size="-1" face="Arial, Helvetica, sans-serif">Copy the following code 
    to data.html</font><br>
    <br>
    XLABEL=Month <br>
    YLABEL=Million $ <br>
    SERIE_1=Products <br>
    SERIE_DATA_1=12|43|50|45|30|32|42 <br>
    <br>
  </li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">copy rchart2.jar to 
    the same directory</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Open Applet.html with 
    your browser</font></li>
</ol>
<p><font face="Arial, Helvetica, sans-serif" size="-1">As you can see the result 
  is the same, but the chart parameters are read from a external file (which could 
  be a JSP , ASP , cgi ...). Format of the external file is:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><i>PARAMETERNAME=VALUE</i></font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Note: make sure there are 
  not trailing spaces after VALUE.</font></p>
<p>&nbsp;</p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="1"></a>Deploying 
  the applet</font></h4>
<h4>&nbsp;</h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">When you deploy the applet 
  to your server you will need to copy the following 2 files:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">rchart2.jar: contains 
    the applet (see CODEBASE parameter)</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">the HTML page that uses 
    the applet (or JSP, ASP, Php ....)</font></li>
</ul>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The following parameters 
  are used to configurate the applet:</font></p>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="26%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="106"> 
      <p>&lt;APPLET<br>
        CODEBASE = &quot;./&quot;<br>
        CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
        NAME = &quot;TestApplet&quot;<br>
        ARCHIVE = &quot;rchart2.jar&quot;<br>
        WIDTH = 500<br>
        HEIGHT = 500<br>
        ALIGN = middle<br>
        MAYSCRIPT <br>
        &gt; </p>
    </td>
    <td width="26%" valign="top" height="106"> 
      <p><font color="#3333FF">Definition of the scale<br>
        This is the directory where rchart.jar should be located.<br>
        This is the name of the applet, you cannot change it.<br>
        Name you want to give to your applet.<br>
        This is the file where the applet is located.<br>
        Size of the applet (in pixels), can also be defined as % of the page's 
        size, for example WIDTH=50% and Height=%50<br>
        Alignment<br>
        You need to include this keyword if you are going to use the OnClickRChart() 
        javascript function. </font></p>
    </td>
  </tr>
</table>
<h4>&nbsp;</h4>
<h4>&nbsp;</h4>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="2"></a>Realtime 
  applets</font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">If you want to update the 
  chart (the applet) every X seconds with new data from your server you must configure 
  the applet like this:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Set the parameter CHART_REALTIME 
    to true</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Use the REALTIME_MSECS 
    parameter to set the update frecuency (the default is 2000= 2 seconds): REALTIME_MSECS=2000. 
    </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Set the data file (Url) 
    where the new data should be read from (optional). The parameter is: REALTIME_DATAFILE=http://myserver.com/updateData.asp 
    </font></li>
</ul>
<p><font face="Arial, Helvetica, sans-serif" size="-1">where the program &quot;updateData.asp&quot; 
  (can also be php, jsp ...) must return the parameters in the usual format (PARAMETERNAME=VALUE). 
  For example it might return this information: &quot;SERIE_DATA_1= 12|34|46|56&quot; 
  in order to update the values for serie 1.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><br>
  RChart will also trigger a Javascript function called &quot;OnRChart()&quot; 
  if you set CHART_JAVASCRIPT_EVENTS=true. </font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">This is an example of a 
  bar chart being updated every 2 seconds (default value for REALTIME_MSECS):</font></p>
<ol>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"> Copy this code to a 
    file named realtime.html:</font><br>
    <br>
    <font size="-1">&lt;/HEAD&gt;<br>
    &lt;BODY&gt;<br>
    &lt;BR&gt;<br>
    &lt;APPLET<br>
    CODEBASE = &quot;.&quot;<br>
    CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
    ARCHIVE=rchart2.jar <br>
    NAME = &quot;TestApplet&quot;<br>
    WIDTH = 300<br>
    HEIGHT = 300<br>
    HSPACE = 0<br>
    VSPACE = 0<br>
    ALIGN = middle<br>
    &gt;<br>
    &lt;PARAM NAME = &quot;TITLECHART&quot; VALUE = &quot;Sales 1999&quot;&gt;<br>
    &lt;PARAM NAME = &quot;LEGEND&quot; VALUE = &quot;TRUE&quot;&gt;<br>
    &lt;PARAM NAME = &quot;XLABEL&quot; VALUE = &quot;Month&quot;&gt;<br>
    &lt;PARAM NAME = &quot;YLABEL&quot; VALUE = &quot;Million $&quot;&gt;<br>
    &lt;PARAM NAME = &quot;XAXIS_LABELS&quot; VALUE = &quot;June|July|Aug.|Sept.|Oct.|Nov.|Dec.&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_1&quot; VALUE = &quot;Products&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_2&quot; VALUE = &quot;Services&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_TYPE_1&quot; VALUE = &quot;BAR&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_TYPE_2&quot; VALUE = &quot;BAR&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_STYLE_1&quot; VALUE = &quot;RED&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_BARS_COLORS_1&quot; VALUE = &quot;WHITE|YELLOW&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_STYLE_2&quot; VALUE = &quot;BLUE&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_FONT_1&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_FONT_2&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_DATA_1&quot; VALUE = &quot;10|43|50|45|30|32|42&quot;&gt;<br>
    <br>
    </font><font size="-1"><b>&lt;PARAM NAME = &quot;REALTIME_DATAFILE&quot; VALUE 
    = &quot;data.html&quot;&gt;<br>
    <br>
    </b></font><font size="-1">&lt;PARAM NAME = &quot;SERIE_DATA_2&quot; VALUE 
    = &quot;-10|41|48|39|36|34|50&quot;&gt;<br>
    &lt;PARAM NAME = &quot;CHART_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
    &lt;PARAM NAME = &quot;CHART_FILL&quot; VALUE = &quot;0xffcc00&quot;&gt;<br>
    &lt;PARAM NAME = &quot;BIG_TICK_INTERVALX&quot; VALUE = &quot;1&quot;&gt;<br>
    &lt;PARAM NAME = &quot;BIG_TICK_INTERVALY&quot; VALUE = &quot;1&quot;&gt;<br>
    &lt;PARAM NAME = &quot;YSCALE_MIN&quot; VALUE = &quot;-15&quot;&gt;<br>
    &lt;PARAM NAME = &quot;XSCALE_MIN&quot; VALUE = &quot;0&quot;&gt;<br>
    &lt;PARAM NAME = &quot;XSCALE_MAX&quot; VALUE = &quot;7&quot;&gt;<br>
    </font><font size="-1">&lt;PARAM NAME = &quot;YAXIS_AUTO_TICKS&quot; VALUE 
    = &quot;7&quot;&gt;<br>
    </font><font size="-1">&lt;PARAM NAME = &quot;LEGEND_BORDER&quot; VALUE = 
    &quot;0.2|BLACK|LINE&quot;&gt;<br>
    &lt;PARAM NAME = &quot;LEGEND_FILL&quot; VALUE = &quot;WHITE&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_BORDER_TYPE_1&quot; VALUE = &quot;RAISED&quot;&gt;<br>
    &lt;PARAM NAME = &quot;SERIE_BORDER_TYPE_2&quot; VALUE = &quot;RAISED&quot;&gt;<br>
    &lt;PARAM NAME = &quot;BARCHART_BARSPACE&quot; VALUE = &quot;1&quot;&gt;</font><font size="-1"><br>
    &lt;/APPLET&gt;<br>
    &lt;/BODY&gt;<br>
    &lt;/HTML&gt;<br>
    <br>
    </font></li>
  <li><font size="-1" face="Arial, Helvetica, sans-serif">Copy rchart.jar to the 
    same directory as realtime.html</font></li>
  <li><font size="-1" face="Arial, Helvetica, sans-serif">Create a file called 
    &quot;data.html&quot; that contains: SERIE_DATA_1=10|16|5|4|30|2|4</font></li>
  <li><font size="-1" face="Arial, Helvetica, sans-serif">Open now realtime.html 
    with your browser, the result will be:</font><br>
    <br>
    <img src="images/reatime1.png" width="261" height="286"><br>
    <br>
  </li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Change now the content 
    of data.html like this: SERIE_DATA_1=<b><font color="#FF0033">25</font></b>|16|5|4|30|2|4</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">After a maximum of 2 
    seconds the result will be:</font><br>
    <br>
    <img src="images/reatime2.png" width="285" height="284"> </li>
</ol>
<p><font face="Arial, Helvetica, sans-serif" size="-1">A good alternative for 
  updating the chart with new values is by using a Javascript function. As you 
  can see in the example below, you need 3 new entries in your html page: </font></p>
<ol>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">create a Javascript 
    function called OnRChart() which will get called automatically when the chart 
    needs to be updated. You can use the function to set new values for the chart's 
    parameters.</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Enter the MAYSCRIPT 
    keyword in the &lt;APPLET&gt; tag to enabled Javascript integration.</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">Set the parameter CHART_JAVASCRIPT_EVENTS=true</font></li>
</ol>
<ol>
  <blockquote> 
    <p><br>
      <br>
      <font face="Courier New, Courier, mono" size="-1">&lt;HEAD&gt;<br>
      &lt;SCRIPT&gt;<br>
      function OnRChart() {<br>
      // SET NEW DATA<br>
      document.TestApplet.setParameter(&quot;SERIE_DATA_1&quot;,&quot;|50|45|30|32|&quot;);<br>
      }<br>
      &lt;/SCRIPT&gt;<br>
      &lt;/HEAD&gt; <br>
      &lt;APPLET<br>
      CODEBASE = &quot;.&quot;<br>
      CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
      NAME = &quot;TestApplet&quot;<br>
      ...<br>
      <b>MAYSCRIPT</b><br>
      &gt;</font></p>
    <p><font face="Courier New, Courier, mono" size="-1">&lt;PARAM NAME = &quot;TITLECHART&quot; 
      VALUE = &quot;Realtime chart&quot;&gt;<br>
      ......</font></p>
    <p><font face="Courier New, Courier, mono" size="-1"><b>&lt;PARAM NAME = &quot;CHART_JAVASCRIPT_EVENTS&quot; 
      VALUE = &quot;true&quot;&gt;</b></font></p>
  </blockquote>
</ol>
<p>&nbsp; </p>
<p><br>
</p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="3"></a>Javascript 
  integration </font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">You may also use Javascript 
  to change the chart displayed in the applet. The applet has the following methods:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">setParameter(String 
    param,String value): sets a parameter. Call rebuild to apply changes. </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">loadFromFile(String 
    psFile,String Clear): load a definition file. Clear can be 'N' or 'Y'. If 
    'N', the new parameters will be added to the previous set parameters. If 'Y' 
    the chart will be completelly reset. </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">rebuild(String Clear,String 
    reReadFile): Repaints the chart . Clear can be 'N' or 'Y'. If 'N', the new 
    parameters will be added to the previous set parameters. If 'Y' the chart 
    will be completelly reset. reReadFile can be 'N' or 'Y'. It specifies wheter 
    the file in the DATAFILE parameter should be reread. </font></li>
</ul>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><br>
  For example, to change the line's style of the second serie of a chart you can 
  use the following JavaScript function:</font></p>
<blockquote> 
  <blockquote>
    <p><font size="-1">function changeStyle() { <br>
      document.TestApplet.setParameter('SERIE_STYLE_2','2|GREEN|DASHED'); <br>
      document.TestApplet.rebuild('N','N'); <br>
      }</font></p>
  </blockquote>
</blockquote>
<p><font face="Arial, Helvetica, sans-serif" size="-1">RChart will trigger the 
  <i>OnClickRChart</i> event when the user clicks on bar (barchart), point (linechart) 
  or item (piechart). In order to activate this feature you must set the parameters:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">CHART_JAVASCRIPT_EVENTS=True<br>
  CHART_POINT_SELECTION=True </font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">This event will receive 
  two parameters:</font></p>
<ol>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">The serie the user clicked 
    on (you can read the serie name with the &quot;name&quot; property)</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">secuence of the point/bar/item 
    the user cliked on (starting at 0). <br>
    </font></li>
</ol>
<p><font face="Arial, Helvetica, sans-serif" size="-1">For example:</font></p>
<blockquote> 
  <p><font face="Arial, Helvetica, sans-serif" size="-1"><i>&lt;SCRIPT&gt;<br>
    function OnClickRChart(serie, valuePosition) { <br>
    alert('You just clicked on serie '+ s.name + ' point ' +p); </i></font></p>
  <p><font face="Arial, Helvetica, sans-serif" size="-1"><i>}<br>
    &lt;/SCRIPT&gt; </i></font></p>
</blockquote>
<p> </p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Note that you must also 
  include the word MAYSCRIPT in the applet parameters.</font></p>
<p>&nbsp;</p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="4"></a></font>ASP</h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The following example will 
  create an area chart.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">It will retrieve the data 
  from an <b>MSAccess database</b> that contains a table called &quot;salesMonth&quot;. 
  This table has three fields: &quot;Products&quot; (integer), &quot;Services&quot; 
  (integer) and &quot;salesMonth&quot; (date), which contains the sales for several 
  months.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The example will display 
  the sales of the last 6 months. It will create a HTML page that contains the 
  applet. Most of the parameters of the applet are constant, however the date 
  labels and the sales data is retrieved from the DB.</font></p>
<blockquote> 
  <blockquote> 
    <blockquote> 
      <p><i><font size="-1" face="Arial, Helvetica, sans-serif">&lt;%@ LANGUAGE=&quot;VBSCRIPT&quot; 
        %&gt;<br>
        &lt;%</font></i><font size="-1" face="Arial, Helvetica, sans-serif"><i>' 
        variables used to store the data used as parameter for the applet<br>
        dim labels, values1,values2<br>
        %&gt;</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i>&lt;HTML&gt;<br>
        &lt;HEAD&gt; &lt;/HEAD&gt;<br>
        &lt;BODY&gt; <br>
        &lt;APPLET<br>
        CODEBASE = &quot;.&quot;<br>
        CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
        ARCHIVE=&quot;rchart2.jar&quot; <br>
        NAME = &quot;TestApplet&quot; <br>
        WIDTH = 500 HEIGHT = 500 <br>
        &gt;</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i><b><font color="#FF0000">&lt;!-- 
        **** VARIABLE DATA, use VBScript to retrieve series data values from database 
        **** --&gt;</font></b><br>
        </i></font><font size="-1" face="Arial, Helvetica, sans-serif"><i>&lt;% 
        ' get data from last 6 months<br>
        set Connect=Server.CreateObject(&quot;ADODB.Connection&quot;)</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> ' <b>open db 
        using a System ODBC data source called &quot;Data&quot; </b><br>
        Connect.ConnectionString=&quot;DSN=data;&quot;<br>
        Connect.Open </i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> ' <b>get sales 
        data, execute SQL</b><br>
        set rs=Connect.Execute(&quot;Select * from SalesMonth Order by salesMonth 
        DESC&quot;)</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> i=1<br>
        values1=&quot;&quot;<br>
        values2=&quot;&quot;<br>
        labels=&quot;&quot;</i></font></p>
      <blockquote> 
        <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> ' <b>loop, 
          plot only last 6 months</b><br>
          while (not rs.eof) and (i&lt;=6)<br>
          if (i&gt;1) then<br>
          ' <b>add separators to create list of values</b><br>
          values1= &quot;|&quot; &amp; values1<br>
          values2= &quot;|&quot; &amp; values2<br>
          labels= &quot;|&quot; &amp; labels<br>
          end if<br>
          <br>
          ' <b>get month name</b><br>
          labels= &quot;&quot; &amp; MonthName(DatePart(&quot;m&quot;,rs(&quot;salesMonth&quot;)),1) 
          &amp; labels<br>
          ' <b>get sales of products</b><br>
          values1= &quot;&quot; &amp; rs(&quot;Product&quot;) &amp; values1<br>
          ' <b>get sales of services</b><br>
          values2= &quot;&quot; &amp; rs(&quot;Services&quot;) &amp; values2</i></font></p>
        <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> i=i+1<br>
          rs.movenext<br>
          wend</i></font></p>
      </blockquote>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i> rs.close<br>
        Connect.close<br>
        set Connect=nothing<br>
        </i></font><font size="-1" face="Arial, Helvetica, sans-serif"><i>%&gt;</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i><b><font color="#FF0000">&lt;!-- 
        **** output of calculated variables**** --&gt;</font></b><br>
        &lt;PARAM NAME = &quot;XAXIS_LABELS&quot; VALUE = &quot;&lt;%=labels%&gt;&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_DATA_2&quot; VALUE = &quot;&lt;%=values1%&gt;&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_DATA_1&quot; VALUE = &quot;&lt;%=values2%&gt;&quot;&gt;</i></font></p>
      <p><font size="-1" face="Arial, Helvetica, sans-serif"><i><br>
        <b><font color="#FF0000">&lt;!-- **** CONSTANT DATA **** --&gt;<br>
        </font></b></i></font><font size="-1" face="Arial, Helvetica, sans-serif"><i>&lt;PARAM 
        NAME = &quot;TITLECHART&quot; VALUE = &quot;Sales&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND&quot; VALUE = &quot;TRUE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XLABEL&quot; VALUE = &quot;Month&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YLABEL&quot; VALUE = &quot;Million $&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_1&quot; VALUE = &quot;Products&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_2&quot; VALUE = &quot;Services&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_1&quot; VALUE = &quot;0.2|0x663300|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_2&quot; VALUE = &quot;0.2|0x99|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_1&quot; VALUE = &quot;RED&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_2&quot; VALUE = &quot;0x99cc&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_1&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_2&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_1&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_2&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_1&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_2&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_FILL&quot; VALUE = &quot;LIGHTGRAY&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALX&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALY&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YSCALE_MIN&quot; VALUE = &quot;0&quot;&gt;<br>
        &lt;PARAM NAME = &quot;TICK_INTERVALY&quot; VALUE = &quot;100&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_FILL&quot; VALUE = &quot;WHITE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BACK_IMAGE&quot; VALUE = &quot;back13.gif&quot;&gt;<br>
        &lt;/APPLET&gt;<br>
        &lt;/BODY&gt;<br>
        &lt;/HTML&gt;</i></font></p>
    </blockquote>
  </blockquote>
</blockquote>
<h4>&nbsp;</h4>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="5"></a></font>JSP</h4>
<p><font size="-1" face="Arial, Helvetica, sans-serif">The following example will 
  create an area chart.</font></p>
<p><font size="-1" face="Arial, Helvetica, sans-serif">It will retrieve the data 
  from an MSAccess database that contains a table called &quot;salesMonth&quot;. 
  This table has three fields: &quot;Products&quot; (integer), &quot;Services&quot; 
  (integer) and &quot;salesMonth&quot; (date), which contains the sales for several 
  months.</font></p>
<p><font size="-1" face="Arial, Helvetica, sans-serif">The example will display 
  the sales of the last 6 months. It will create a HTML page that contains the 
  applet. Most of the parameters of the applet are constant, however the date 
  labels and the sales data is retrieved from the DB.</font></p>
<blockquote> 
  <blockquote> 
    <blockquote> 
      <p><font face="Arial, Helvetica, sans-serif" size="-1"><i>&lt;HTML&gt;<br>
        &lt;HEAD&gt;&lt;/HEAD&gt;<br>
        &lt;BODY&gt;<br>
        &lt;APPLET<br>
        CODEBASE = &quot;.&quot;<br>
        CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
        ARCHIVE=&quot;rchart2.jar&quot; <br>
        NAME = &quot;TestApplet&quot; <br>
        WIDTH = 500 HEIGHT = 500&gt;</i></font></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1" color="#FF0000"><b>&lt;!-- 
        **** VARIABLE DATA, use Java to retrieve series data values from database 
        **** --&gt;</b></font><font face="Arial, Helvetica, sans-serif" size="-1"><br>
        &lt;%<br>
        java.sql.Statement st;<br>
        java.sql.ResultSet rs;<br>
        java.sql.Connection db=null;<br>
        int i=1;<br>
        String labels=&quot;&quot;;<br>
        String values1=&quot;&quot;;<br>
        String values2=&quot;&quot;;</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>// connect 
        to database<br>
        // open db using a System ODBC data source called &quot;Data&quot; </b><br>
        try {<br>
        Class.forName(&quot;sun.jdbc.odbc.JdbcOdbcDriver&quot;);<br>
        db = java.sql.DriverManager.getConnection(&quot;jdbc:odbc:data&quot;, 
        &quot;&quot;, &quot;&quot;);<br>
        }<br>
        catch(Exception e) {<br>
        System.err.println(&quot;Error eonnecting to DB:&quot; + e.getMessage()); 
        }</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1">try {<br>
        st = db.createStatement();<br>
        <b>/*get sales data, execute SQL*/ </b><br>
        rs = st.executeQuery(&quot;Select * from SalesMonth Order by salesMonth 
        DESC&quot;);</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>/* iterate 
        on sales data, up to 6 rows */</b><br>
        while ((i &lt;= 6) &amp;&amp; (rs.next())) {<br>
        <b>/* concatenate | separator */</b><br>
        if (i&gt;1) {<br>
        values1= &quot;|&quot; + values1;<br>
        values2= &quot;|&quot; + values2;<br>
        labels= &quot;|&quot; + labels;<br>
        }</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>/* concatenate 
        value */</b><br>
        values1= &quot;&quot; + rs.getString(&quot;Services&quot;) + values1;<br>
        values2= &quot;&quot; + rs.getString( &quot;Product&quot;) + values2;<br>
        java.text.SimpleDateFormat df= new java.text.SimpleDateFormat(&quot;MMM&quot;);<br>
        labels= &quot;&quot; + df.format(rs.getDate(&quot;salesMonth&quot;)) + 
        labels;</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1">i++;<br>
        }</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1">rs.close();<br>
        db.close();<br>
        }</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1">catch(Exception 
        e) {<br>
        System.err.println(&quot;Error:&quot; + e.getMessage());}</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>/* echo values 
        for serie 1 */</b><br>
        out.println(&quot;&lt;PARAM NAME = \&quot;SERIE_DATA_1\&quot; VALUE = 
        \&quot;&quot; + values1 + &quot;\&quot;&gt;&quot;);</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>/* echo values 
        for serie 2 */</b><br>
        out.println(&quot;&lt;PARAM NAME = \&quot;SERIE_DATA_2\&quot; VALUE = 
        \&quot;&quot;+ values2 + &quot;\&quot;&gt;&quot;);</font></i></p>
      <p><i><font face="Arial, Helvetica, sans-serif" size="-1"><b>/* echo values 
        for labels */</b><br>
        out.println(&quot;&lt;PARAM NAME = \&quot;XAXIS_LABELS\&quot; VALUE = 
        \&quot;&quot;+ labels + &quot;\&quot;&gt;&quot;);<br>
        %&gt;</font></i><i><font face="Arial, Helvetica, sans-serif" size="-1"><br>
        <b><font color="#FF0000">&lt;!-- **** CONSTANT DATA **** --&gt;</font></b><br>
        &lt;PARAM NAME = &quot;TITLECHART&quot; VALUE = &quot;Sales&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND&quot; VALUE = &quot;TRUE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XLABEL&quot; VALUE = &quot;Month&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YLABEL&quot; VALUE = &quot;Million $&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_1&quot; VALUE = &quot;Services&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_2&quot; VALUE = &quot;Products&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_1&quot; VALUE = &quot;0.2|0x663300|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_2&quot; VALUE = &quot;0.2|0x99|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_1&quot; VALUE = &quot;RED&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_2&quot; VALUE = &quot;0x99cc&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_1&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_2&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_1&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_2&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_1&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_2&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_FILL&quot; VALUE = &quot;LIGHTGRAY&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALX&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALY&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YSCALE_MIN&quot; VALUE = &quot;0&quot;&gt;<br>
        &lt;PARAM NAME = &quot;TICK_INTERVALY&quot; VALUE = &quot;100&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_FILL&quot; VALUE = &quot;WHITE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BACK_IMAGE&quot; VALUE = &quot;back13.gif&quot;&gt;<br>
        &lt;/APPLET&gt;<br>
        &lt;/BODY&gt;<br>
        &lt;/HTML&gt;</font></i></p>
      <h4>&nbsp;</h4>
    </blockquote>
  </blockquote>
</blockquote>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="6"></a></font>Php</h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The following example will 
  create an area chart.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">It will retrieve the data 
  from an <b>MSAccess database</b> that contains a table called &quot;salesMonth&quot;. 
  This table has three fields: &quot;Products&quot; (integer), &quot;Services&quot; 
  (integer) and &quot;salesMonth&quot; (date), which contains the sales for several 
  months.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The example will display 
  the sales of the last 6 months. It will create a HTML page that contains the 
  applet. Most of the parameters of the applet are constant, however the date 
  labels and the sales data is retrieved from the DB.</font></p>
<blockquote> 
  <blockquote> 
    <blockquote> 
      <p><font size="-1"><i><font face="Arial, Helvetica, sans-serif">&lt;HTML&gt;<br>
        &lt;HEAD&gt;&lt;/HEAD&gt;<br>
        &lt;BODY&gt;<br>
        &lt;APPLET<br>
        CODEBASE = &quot;.&quot;<br>
        </font><font size="-1" face="Arial, Helvetica, sans-serif"><i>CODE = &quot;com.java4less.rchart.web.ChartApplet.class&quot;<br>
        ARCHIVE=&quot;rchart2.jar&quot; </i></font><font face="Arial, Helvetica, sans-serif"><br>
        NAME = &quot;TestApplet&quot;<br>
        WIDTH = 500 HEIGHT = 500 ALIGN = middle<br>
        &gt;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"><b><font color="#FF0000">&lt;!-- 
        **** VARIABLE DATA, use Php to retrieve series data values from database 
        **** <br>
        --&gt;</font></b></font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">&lt;?<br>
        $labels=&quot;&quot;;<br>
        $values2=&quot;&quot;;<br>
        $values1=&quot;&quot;;<br>
        $i=1;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">/* <b>connect 
        to database<br>
        open db using a System ODBC data source called &quot;Data&quot;</b> */<br>
        $odbcid = odbc_connect (&quot;data&quot;, &quot;&quot;, &quot;&quot;, 
        &quot;&quot;); <br>
        </font></i></font><font face="Arial, Helvetica, sans-serif"><i><font size="-1">/* 
        </font><font size="-1" face="Arial, Helvetica, sans-serif"><i><b>get sales 
        data, execute SQL</b></i></font>*/<font size="-1"> <br>
        $resultid = odbc_exec ($odbcid, &quot;Select * from SalesMonth Order by 
        salesMonth DESC&quot;) ; </font></i></font></p>
      <blockquote> 
        <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"><br>
          /*<b> iterate on sales data, up to 6 rows</b> */<br>
          while (($i &lt;= 6) and (odbc_fetch_row($resultid))) {<br>
          /* <b>concatenate | separator </b>*/<br>
          if ($i&gt;1) {<br>
          $values1= &quot;|&quot; . $values1;<br>
          $values2= &quot;|&quot; . $values2;<br>
          $labels= &quot;|&quot; . $labels;<br>
          }</font></i></font></p>
        <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"> /* <b>concatenate 
          value </b>*/<br>
          $values1= odbc_result ($resultid, &quot;Services&quot;) . $values1;<br>
          $values2= odbc_result ($resultid, &quot;Product&quot;) . $values2;<br>
          $labels= odbc_result ($resultid, &quot;salesMonth&quot;) . $labels;</font></i></font></p>
        <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"> $i=$i+1;<br>
          /* <b>next record </b>*/<br>
          </font></i></font><font face="Arial, Helvetica, sans-serif"><i><font size="-1">odbc_fetch_row($resultid);<br>
          </font></i></font><font face="Arial, Helvetica, sans-serif"><i><font size="-1">} 
          </font></i></font></p>
      </blockquote>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"><br>
        /* <b>echo values for serie 1</b> */<br>
        echo &quot;&lt;PARAM NAME = \&quot;SERIE_DATA_1\&quot; VALUE = \&quot;&quot;;<br>
        echo $values1;<br>
        echo &quot;\&quot;&gt;&quot;;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">/* <b>echo 
        values for serie 2</b> */<br>
        echo &quot;&lt;PARAM NAME = \&quot;SERIE_DATA_2\&quot; VALUE = \&quot;&quot;;<br>
        echo $values2;<br>
        echo &quot;\&quot;&gt;&quot;;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">/* <b>echo 
        values for labels</b> */<br>
        echo &quot;&lt;PARAM NAME = \&quot;XAXIS_LABELS\&quot; VALUE = \&quot;&quot;;<br>
        echo $labels;<br>
        echo &quot;\&quot;&gt;&quot;;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">/* <b>close 
        result </b>*/<br>
        odbc_free_result($resultid);<br>
        /* <b>close connection</b> */<br>
        odbc_close($odbcid);</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1">?&gt;</font></i></font></p>
      <p><font face="Arial, Helvetica, sans-serif"><i><font size="-1"><br>
        <font color="#FF0000"><b>&lt;!-- **** CONSTANT DATA **** --&gt;<br>
        </b></font></font></i></font><font face="Arial, Helvetica, sans-serif"><i><font size="-1">&lt;PARAM 
        NAME = &quot;TITLECHART&quot; VALUE = &quot;Sales&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND&quot; VALUE = &quot;TRUE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XLABEL&quot; VALUE = &quot;Month&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YLABEL&quot; VALUE = &quot;Million $&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_1&quot; VALUE = &quot;Services&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_2&quot; VALUE = &quot;Products&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_1&quot; VALUE = &quot;0.2|0x663300|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_STYLE_2&quot; VALUE = &quot;0.2|0x99|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_1&quot; VALUE = &quot;RED&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FILL_2&quot; VALUE = &quot;0x99cc&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_1&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_FONT_2&quot; VALUE = &quot;Arial|PLAIN|8&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_1&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_POINT_2&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_1&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;SERIE_TYPE_2&quot; VALUE = &quot;LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;CHART_FILL&quot; VALUE = &quot;LIGHTGRAY&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALX&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BIG_TICK_INTERVALY&quot; VALUE = &quot;1&quot;&gt;<br>
        &lt;PARAM NAME = &quot;YSCALE_MIN&quot; VALUE = &quot;0&quot;&gt;<br>
        &lt;PARAM NAME = &quot;TICK_INTERVALY&quot; VALUE = &quot;100&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_BORDER&quot; VALUE = &quot;0.2|BLACK|LINE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;LEGEND_FILL&quot; VALUE = &quot;WHITE&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;XAXIS_TICKATBASE&quot; VALUE = &quot;true&quot;&gt;<br>
        &lt;PARAM NAME = &quot;BACK_IMAGE&quot; VALUE = &quot;back13.gif&quot;&gt;<br>
        &lt;/APPLET&gt;<br>
        &lt;/BODY&gt;<br>
        &lt;/HTML&gt;</font></i></font></p>
    </blockquote>
  </blockquote>
</blockquote>
<h4>&nbsp;</h4>
<hr>
<p>&nbsp;</p>
</body>
</html>
